<template>
	<!-- Main content -->
	<section class='content'>
		<div class="box box-default">
			<div class="box-header with-border form-horizontal">
				<div class="row">
					<div class="col-md-3">
						<div class="form-group">
							<label class="col-md-4 control-label">批次号</label>
							<div class="col-md-8">
								<input class="form-control" placeholder="输入批次号">
							</div>
						</div>
					</div>
					<div class="col-md-3">
						<div class="form-group">
							<label class="col-md-4 control-label">上报结果</label>
							<div class="col-md-8 checkbox">
								<label>
									<input type="checkbox">成功
								</label>
								<label>
									<input type="checkbox">失败
								</label>
							</div>
						</div>
					</div>
				</div>
				<div class="text-right">
					<button class="btn btn-default search_btn">搜索</button>
				</div>
			</div>

			<div class="box-body">
				<table class="table table-hover">
					<thead>
					<tr>
						<th>批次号</th>
						<th>数据类型</th>
						<th>上报结果</th>
					</tr>
					</thead>
					<tbody>
					<tr v-for="loan in loans">
						<td>---</td>
						<td>{{loan['contractNo']}}</td>
						<td>已上报</td>
					</tr>
					</tbody>
				</table>
			</div>
			<div class="box-footer">
			</div>
		</div>
	</section>
	<!-- /.content -->
</template>

<script type="text/ecmascript-6">
	export default{
		data(){
			return {
				layer:{
					add:'',
				},
				loans:[],

			}
		},
		methods:{
			fetchLoans(){
				this.$store.dispatch('fetchLoans',{
				}).then((loans)=>{
					this.loans=loans.filter(function(loan){
						return !loan['uploadStatus'].match("no_upload");
					})
				})
			}
		},
		filters:{
			uploadStatus(){

			}
		},
		mounted(){
			this.fetchLoans();
			this.$nextTick(function () {
			})
		},
		beforeDestroy(){
			//用户使用输入路由跳页的时候
			window.layer.close(this.layer.add);
		}
	}
</script>
<style>
	.info-box {
		cursor: pointer;
	}

	.info-box-content {
		text-align: center;
		vertical-align: middle;
		display: inherit;
	}

	.fullCanvas {
		width: 100%;
	}
</style>
